<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:p="http://primefaces.prime.com.tr/ui">

<ui:composition template="loginPageLayout.xhtml">
	<ui:define name="title">Login</ui:define>
	<ui:define name="content">
		<h:form>
			<div align="center">
				<table align="center">
					<tr>
						<td><h:graphicImage value="img/linkedIn_logo.jpg"
								title="Logo" /></td>
					</tr>
				</table>
				<p:panel id="login" footer="" header="Ingreso Usuarios" toggleable="true"
					closable="false" toggleSpeed="500"
					style="align:center;margin:3% 20% 30% 20%;">
					<h:panelGrid columns="3">
						<h:outputText value="Usuario:" />
						<h:inputText value="#{login.user}" id="user" name="usuario"
							label="usuario" required="true">
						</h:inputText>
						<h:message for="user" />
						<h:outputText value="Pass" />
						<p:password value="#{login.pass}" id="pass" name="pass"
							label="pass" required="true" minLength="6" for="pass" color="red"></p:password>
						<h:message for="pass" />
						<h:commandButton value="Ingresar" action="#{login.userLogin}" />

					</h:panelGrid>

					<h:panelGrid columns="1">

						<p:commandLink action="altaUsuario.xhtml"
							style="margin-right:20px;" ajax="false" immediate="true">
							<h:outputText value="Nuevo Usuario" />
						</p:commandLink>

						<p:lightBox iframe="true" width="80%" height="80%">

							<h:outputLink
								value="#{facesContext.externalContext.requestContextPath}/recuperar.xhtml"
								title="Olvido su Contraseña">
								<h:outputText value="Olvido su Contraseña" />
							</h:outputLink>
						</p:lightBox>

					</h:panelGrid>

					<p>
						<h:messages style="color: red" />
					</p>
				</p:panel>
				<p:resizable for="login" animate="true" effect="swing" effectDuration="normal"/> 
			</div>
		</h:form>
	</ui:define>
</ui:composition>
</html>